import React,{useEffect, useState} from 'react'

export default function MyComponent(){
    const [visible,setVisible] = useState(false)
  return (
    <>
    {visible && <MyChildComponent/>}
    <button onClick={() => setVisible(!visible)}>Toggle Child components visbile</button>
    </>
  )
}
const MyChildComponent = () => {
    useEffect(() => {
        console.log('mounted')
        return () => {
            console.log('unmount')
        }
    },[])
    return (
        <div>
            MyChildComponent
        </div>
    )
}
